<script setup lang="ts">
import { useDark, useToggle } from '@vueuse/core'
import { ElButton } from 'element-plus'
const isDark = useDark()
const toggleDark = useToggle(isDark)
</script>

<template>
  <el-button text @click="toggleDark()" style="height: 100%; width: 100%">
    <span class="ml-2">{{ isDark ? 'Light' : 'Dark' }}</span>
  </el-button>
</template>
